<template>
	<view class="product_rich">
		<view class="header-banner_rich">
			<view class="imgsvideo_block" v-if="imgsvideoSta">
				<text class="imgstext_1" :class="[imgsvideoCurrent == 0 ? 'isColor' : '']" @click="tab_video">视频</text>
				<text class="imgstext_2" :class="[imgsvideoCurrent == 1 ? 'isColor' : '']" @click="tab_imgs">图集</text>
			</view>
			<view v-if="isVideoSta">
				<video alt="example" id="newVideos" style="width: 750rpx; height: 750rpx" :src="videosLIst[0]" autoplay
					controls></video>
			</view>
			<view v-if="isImgsSta">
				<swiper class="swiper-img" @change="onBanner" :interval="3000" :current="current" autoplay>
					<swiper-item v-for="(item, idx) in imgList" :key="idx">
						<image :src="item" mode="aspectFit" class="item"></image>
					</swiper-item>
				</swiper>
			</view>
		</view>

		<!-- 轮播图指示灯 -->
		<view class="pilot_lamp_rich">
			<view class="circle_rich" :class="[current === index ? 'bolding' : 'bolding1']"
				v-for="(item, index) in imgList" :key="index"></view>
		</view>

		<view class="pro_name">
			<view class="price-area">
				<view class="left">
					<view>
						<text v-if="data.productSku">
							<text class="l"
								style="margin-right: 20rpx">¥{{ ((data.productSku[0].salePrice)/choiceDays).toFixed(2) }}/<text
									style="font-size: 26rpx;">天</text></text>
						</text>
					</view>
				</view>
			</view>
			<view class="title">
				<text class="title-text">{{ data.name }}</text>
			</view>
		</view>
		<view style="background: #f5f5f5; height: 15rpx; border-radius: 0"></view>
		<!-- 下单流程图 -->
		<!-- <view style="display: flex; justify-content: center; padding: 15rpx 0">
			<image src="https://mochongzujie.oss-cn-hangzhou.aliyuncs.com/171a86bc53d74efb893fda931ca072c3.png"
				style="width: 720rpx; height: 215rpx; border-radius: 25rpx" mode="scaleToFill"></image>
		</view> -->
		<view style="background: #f5f5f5; height: 15rpx; border-radius: 0"></view>
		<view class="three_container">
			<view class="three_box">
				<view class="three_box_item">
					<view class="tit">发货配送</view>
					<view class="tit1">全国多仓 即下即发</view>
				</view>
				<view class="three_box_item">
					<view class="tit">商品保障</view>
					<view class="tit1">优选正品 极速发货</view>
				</view>
				<!-- <view class="three_box_item">
					<view class="tit">选择规格</view>
					<view class="tit1" style="display: flex; justify-content: center; align-items: center"
						@click="select_guige">
						<text>{{ guigeStr || ' 颜色' }}{{ ',' + guigeNameStr || '规格 ' }}</text>
						<image style="width: 15rpx; height: 25rpx; margin-left: 20rpx"
							src="../../static/my/black_jiantou.png"></image>
					</view>
				</view> -->
			</view>
		</view>
		<view class="usenotice_container">
			<view class="usenotice_box">
				<view class="usenotice_box_item">
					<view style="display: flex; align-items: center; margin-bottom: 15rpx">
						<image src="../../static/product/baozhang.png"
							style="width: 50rpx; height: 50rpx; margin-right: 10rpx"></image>
						<view class="big_tit">正品保障</view>
					</view>
					<view class="title">1.平台所售产品质量保证，均为正品，请放心购买。</view>
				</view>
				<view class="usenotice_box_item">
					<view style="display: flex; align-items: center; margin-bottom: 15rpx">
						<image src="../../static/product/qianshou.png"
							style="width: 50rpx; height: 50rpx; margin-right: 10rpx"></image>
						<view class="big_tit">商品签收</view>
					</view>
					<view class="title">1.为保障您的购买权益，在签收快递时先确保商品的完整性，如发现错发、漏发、包装破损等情况请及时联系客服处理。</view>
					<view class="title">
						2.平台所有商品均以快递邮寄形式发出，并按照下单预留收货地址信息寄出，请勿中途转寄。另快递要求本人签收，所有中途转寄及代签收行为均视为本人签收。
					</view>
				</view>
				<!-- <view class="usenotice_box_item">
					<view style="display: flex; align-items: center; margin-bottom: 15rpx">
						<image src="../../static/product/qianshou.png"
							style="width: 50rpx; height: 50rpx; margin-right: 10rpx"></image>
						<view class="big_tit">商品说明</view>
					</view>
					<view class="title">1.国际金价会随市场变化而有浮动，本平台金价也根据市场因素及运营情况而调整。</view>
					<view class="title">2.因促销调整或金价浮动原因，不退款/退货，不补差价，请谅解。</view>
				</view> -->
				<view class="usenotice_box_item">
					<view class="last_word">如有任何疑问请咨询（我的页面）我的客服</view>
				</view>
			</view>
		</view>
		<view class="details_rich">
			<view class="parameter_rich">
				<view v-if="data.parameters && data.parameters.length">
					商品参数
					<view class="parameterItem_rich">
						<t-table border-color="#DEDEDE">
							<t-tr v-for="(item, index) in data.parameters" :key="index">
								<t-td width="40%">{{ item.name }}</t-td>
								<t-td width="60%">{{ item.value }}</t-td>
							</t-tr>
						</t-table>
					</view>
				</view>
				<!-- 商品介绍 -->
				<view style="font-size: 0px">
					<rich-text :nodes="nodes"></rich-text>
				</view>
			</view>
		</view>

		<!-- 底部tab按钮功能 -->
		<view class="footer_rich">
			<view class="home_rich" @tap="back_index()" style="margin-left: 0">
				<image src="../../static/product/home1.png" mode="scaleToFill" class="home-img"></image>
				<view class="text">首页</view>
			</view>
			<view class="home_rich" style="margin-left: 0rpx">
				<view>
					<image src="../../static/product/scno.png" mode="scaleToFill"
						:class="{ 'home-img1': true, hide: collected }" @click="addProductCollection"></image>
					<image src="../../static/product/scyes.png" mode="scaleToFill"
						:class="{ 'home-img1': true, hide: !collected }" @click="cancelProductCollection"></image>
					<view class="text">收藏</view>
				</view>
			</view>
			<view class="home_rich" @tap="gotoServerMan" style="margin-left: 0">
				<u-icon name="server-man" color="#f35111" size="43" style="margin-bottom: 2upx"></u-icon>
				<view class="text">客服</view>
			</view>
			<view style="display: flex; color: white">
				<view class="bot_my_rich" @tap="mianyazu()" :style="{
                        backgroundColor: themeColor
                    }">
					立即租
				</view>
			</view>
		</view>
		<!-- 点击免押租 或者购买弹起-->
		<wyb-popup ref="productDetails" type="bottom" width="500" radius="6" :showCloseIcon="true"
			@productSku="productSku">
			<view class="productDetails_rich" v-if="isShow">
				<view class="shop" style="height: 170rpx">
					<image :src="firstGuigeDataObj.specSrc" mode="scaleToFill" class="img"></image>
					<view class="content" v-if="popupLeaseorBuyorAddcar != 2">
						<view class="price-area">
							<view class="left">
								<text class="m"
									style="font-size: 20px; color: #f00">¥{{ isBuyOut == '4' ? ((firstGuigeDataObj.salePrice)/choiceDays).toFixed(2) : ((firstGuigeDataObj.costPrice)/choiceDays).toFixed(2) }}/<text
										style="font-size: 26rpx;">天</text></text>
							</view>
							<!-- <view v-if="isBuyOut == '2'">
								<text class="fut">0元下单</text>
								<text class="fut">先享后付</text>
							</view> -->
						</view>
					</view>
					<!-- 买：弹起框商品的价格  -->
					<view class="content" v-else>
						<view class="price-area">
							<view class="left" style="color: red">
								<text class="m">¥</text>
								<text class="l">{{ getPartMoney(true, firstBuyprice) }}</text>
								<text class="d">.</text>
								<text class="r">{{ getPartMoney(false, firstBuyprice) }}</text>
							</view>
						</view>
					</view>
				</view>

				<!-- 一二级规格数据 -->
				<scroll-view scroll-y="true" style="white-space: nowrap; max-height: 700rpx" show-scrollbar="false">
					<view style="margin-top: 20rpx" v-if="popupLeaseorBuyorAddcar != 2">
						<view class="choice">
							<view class="title">付款方式</view>
							<text class="title-item" v-for="(productLeaseMode, index) in productLeaseModeList"
								:key="index" @click="getChoseBuyoutOrSend(productLeaseMode.id)" :style="{
                                    border: isBuyOut === productLeaseMode.id ? '2rpx solid #f35111' : '2rpx solid #F2F2F2',
                                    background: isBuyOut === productLeaseMode.id ? '#fff' : '#F2F2F2'
                                }">
								{{ productLeaseMode.name }}
							</text>
						</view>
					</view>

					<view class="choice">
						<view class="title">租期天数</view>
						<scroll-view class="scroll_guige" scroll-x="true" show-scrollbar="false">
							<view v-for="(item, index) in proDayList" :key="index" class="title-item"
								@click="daysChange(index,item.state)" :style="{
					                border: daysCurrent === index ? '2rpx solid #f35111' : '2rpx solid #F2F2F2',
					                background: '#F2F2F2'
					            }">
								{{ item.day}}天({{item.periods}}期)
							</view>
						</scroll-view>
					</view>

					<view class="choice">
						<view class="title">规格名称</view>
						<scroll-view class="scroll_guige" scroll-x="true" show-scrollbar="false">
							<view v-for="(item, index) in guigeNameDataList" :key="index"
								:class="{ 'title-item': true }" @click="guigeNameChange(index)" :style="{
                                    border: guigeNameCurrent === index ? '2rpx solid #f35111' : '2rpx solid #F2F2F2',
                                    background: guigeNameCurrent === index ? '#fff' : '#F2F2F2'
                                }">
								{{ item.specColor }}
							</view>
						</scroll-view>
					</view>
					<view class="choice">
						<view class="title">规格</view>
						<scroll-view class="scroll_guige" scroll-x="true" show-scrollbar="false">
							<view v-for="(item, index) in guigeDataList" :key="index" :class="{ 'title-item': true }"
								@click="guigeChange(index)" :style="{
                                    border: guigeCurrent === index ? '2rpx solid #f35111' : '2rpx solid #F2F2F2',
                                    background: guigeCurrent === index ? '#fff' : '#F2F2F2'
                                }">
								{{ item.specValue }}
							</view>
						</scroll-view>
					</view>

					<view class="choice" style="overflow: hidden">
						<view class="title">数量 : {{skuNum}} 件</view>
						<!-- <text>
							<button class="num_btn" @click="cutNum()">-</button>
						</text>
						<text>
							<input class="input" v-model="skuNum" />
						</text>
						<text>
							<button class="num_btn" @click="addNum()">+</button>
						</text> -->
					</view>
				</scroll-view>

				<view style="display: flex; justify-content: center;letter-spacing: 0.1em;">
					<button class="an" @click="onConfirm">确定</button>
				</view>
			</view>
		</wyb-popup>
		<apptet-login ref="modalForm" @noticeRefresh="noticeRefresh"></apptet-login>
		<antsSign ref="antsSignAppH5"></antsSign>
	</view>
</template>
<script>
	import antsSign from "@/components/antsSign/antsSign.vue"
	import parse from 'mini-html-parser2';
	import dot from '@/components/uni-swiper-dot/uni-swiper-dot.vue';
	import tTable from '../subassembly/t-table/t-table.vue';
	import tTr from '../subassembly/t-table/t-tr.vue';
	import tTd from '../subassembly/t-table/t-td.vue';
	import wybPopup from '@/components/wyb-popup/wyb-popup.vue';
	import {
		getZWZUserDetail,
		checkHasPhone,
		loginHandler,
		getUserId,
	} from '@/utils/index.js';
	import {
		EMPTY_PLACEHOLDER,
		shareConfigObj,
	} from '../../utils/constant.js';

	export default {
		data() {
			return {
				longlongHasCertification: false, //是否实名认证过
				showDayList: [],
				noShowDayList: [],
				imgsvideoSta: false, //视频照片切换按钮是否展示，默认不展示
				isImgsSta: true,
				isVideoSta: false,
				imgsvideoCurrent: 0,
				guigeNameStr: '', //展示在商品页面的
				guigeStr: '', //展示在商品页面的
				firstGuigeDataObj: {}, //规格数据的第一组数据是对象
				guigeNameDataList: [], //全部的規格名稱
				guigeDataList: [], //全部的規格
				proDayList: [],
				guigeNameCurrent: 0,
				guigeCurrent: 0,
				daysCurrent: 0, //先享天数
				check_obj: {
					img: ''
				}, //被选中的产品
				nodes: [{
					name: 'div',
					attrs: {
						class: 'infodata',
						style: 'color: #000;'
					},
					children: [{
						type: 'text',
						text: '数据加载中'
					}]
				}],
				imgList: [], //商品banner图列表
				videosLIst: [], //商品的视频集合
				current: 0, //商品图下标
				data: {
					images: [
						[]
					]
				}, //全局数据
				productId: '', //商品id
				currentSku: {}, // 当前选中的租期、规格对象；默认值是接口返回productSku的第一个数据
				choiceDays: 6, //先享天数
				collected: false, //是否收藏
				isBuyOut: 2,
				productLeaseModeList: [],
				buyOutPrice: 0,
				sales_p: 0,
				skuNum: 1,
				isShow: false,
				kefu: false,


				rentAndbuy: 0, //接口传来的  代表当前该商品是租的状态还是买的钻沟通===>3:租和买都存在;    2：只有买;    1：只有租
				rentAndbuyMark: 0, //传到商品确认页的---2：买的状态；   1：租的状态
				popupLeaseorBuyorAddcar: 0, //用于判断租，买，加入购物车的弹窗状态显示内容。1是租，2是买或者加入购物车
				goodsGuige: '', //买;商品规格
				goodsGuigeName: '', //买;商品规格名称--比如黑色，白色.
				goodsGuigeDetail: '', //买;商品规格具体东西--比如128g，256g
				finalSelectImg: '', //买，最后选择的图片
				popupOnlyshoppingCar: 0, //加入购物车-弹窗-点击确定不跳转确认页，还在原页面

				currentSkuBuy: [], //对应买的--弹窗选择不同的规格对应不用的价格
				firstBuyprice: 0, //购买的产品，第一次弹窗弹起的时候，首次显示的价格
				shopName: '', //店铺名称，加入购物车的传参
				reduction: 0, //优惠券减免
				orderCouponLength: 0, //优惠券多少条

				evaList: [], //商品评价列表
				evaListTwo: [], //商品评价列表（不点击详情展示的，最多展示两条）
				isEvaSta: false, //该商品目前是否有评价，默认false没有评价
				screenHeight: 0, //获取当前设备屏幕宽度
				isZhui: false,
				isZhuiImg: false,
				mainPackageAppid: '', //马甲包跳转主包支付，获取当前小程序的主包小程序appid
				serviceTel: '',
				isHasUserIdSta: false, //判断当前用户是否有userId（默认没有）




				//下面是没用的垃圾混淆代码
				renzhengTimeSta1111111: true, //初次请求认证时间默认是带有的，
				zhuceTimeSta11111: false, //初次请求注册时间默认是没有的
				renzhengTimeList11111: [],
				zhuceTimeStaList1111: null,
				detailOrderIdStr11111: '',
				threeTabCurrent1111: 0,
				applyGOodsList11111: [], //供货商列表
				allCardEnterSta1111: false, //默认是false，点击批量卡券入库的时候变为true
				codeAddNumsList11111: [],
				numsList11111: [],
				dataSourceBqcp1111: [],
				selectedRowKeys1111: [],
				selectedRowKeysB11111: [],
				rkVisible11111: false,
				rkjlVisible1111: false,
				lhjlVisible1111: false,
				currentStyleData22222: {},
				dataSourceStyle2222: [],
				showStyleData2222: false,
				indexTemplate2222: [],
				SVGCircleElement3ee: '',
				vshoweqwsc1111: false,
				showStyleDataInfo2222: false,
				opeCategoryList2222: [],
				leimuVisible2222: false,
				selectedRowKeys02222: [],
				selectionRows02222: [],
				selectedRowKeys133333: [],
				selectionRows13333: [],
				selectedRowKeys2333: [],
				selectionRows23333: [],
				selectedRowKeys33333: [],
				selectionRows33333: [],
				selectedRowKeys4333: [],
				selectionRows43333: [],
				curwfqwrentStyleDaterwaInfo444: {},
				currwerentStywerleDatweraInfo1444: {},
				currewerntStyleDataInfo24444: {},
				currentweStyleDytuataIwenfo34444: {},
				currenwetStdfgyleDataInfo44444: {},
				checkZfbPhone_h5444: '',
				plNafgdvfdtjyme4444: '', //四大品类的名字
				uniPdfgrtylatform444: '', //运行环境mp-alipay mp-weixin
				refgjtytrsemark555: '', //备注
				timefgjSelStr5555: '', //选择的上门时间（2023-08-31 00:00:00）
				amOdcuiofasrpm5555: '', //选择的上门时间是上午还是下午
				pageShnjlkgohowTime5555: '', //页面上用户看到的显示的时间
				paraghsdfmsw454: {},
				valhgujtueNum56756: 0,
				addrdraess56756: {}, //上门收货地址
				adawerterydressId575: 0,
				sceoyuitne57567: '',
				tntuiopId56757: '',
				weictyuratCustomer5756: '',
				yuidurtyuoy567567: false,
			};
		},
		components: {
			dot,
			tTable,
			tTr,
			tTd,
			wybPopup,
			antsSign
		},
		computed: {},
		onShareAppMessage() {
			return {
				...shareConfigObj,
				path: `/pagesClass-rich/product/product?productId=${this.productId}`
			};
		},
		onShow() {
			this.judgeIsHasUserId()
			this.rengzhengBefore()
		},
		onReady() {},
		onLoad(e) {
			this.rengzhengBefore()
			let HTML_A_TAG = 'a';
			this.productId = this.$getPageParams(e, 'productId');
			this.getProductList(HTML_A_TAG);
			this.getProductLeaseModeList();
			if (e.openSta == 'true') {
				this.$refs.productDetails.show();
				this.isShow = true;
			}
			if (!this.$getUid()) {
				this.collected = false;
			}
		},
		methods: {
			// 下单钱判断有没有userId， 没有需要去支付宝登录
			judgeIsHasUserId() {
				let userId = this.$getUid()
				this.$request(`order/mall/liteUserOrders/getAliPayAuthorizeUser?uid=${userId}`, {}, 'get', false,
					true).then((res) => {
					if (res.businessSuccess || res.success) {
						this.isHasUserIdSta = res.data
					}
				});
			},


			noticeRefresh() {
				console.log('商品页面支付宝小程序登录成功');
			},
			//点击商品视频或者图集
			tab_video() {
				console.log('点击了视频');
				(this.isImgsSta = false), (this.isVideoSta = true), (this.imgsvideoCurrent = 0);
			},
			tab_imgs() {
				console.log('点击了图集');
				(this.isImgsSta = true), (this.isVideoSta = false), (this.imgsvideoCurrent = 1);
			},
			select_guige() {
				// #ifdef H5 || APP-PLUS
				if (!this.$getUid()) {
					this.$goLogin();
					return;
				}
				// #endif

				// #ifndef H5 || APP-PLUS
				let isPhone = checkHasPhone();
				console.log('去下单是不是最新的手机号', isPhone);
				if (!isPhone) {
					this.$refs.modalForm.toLogin();
					return;
				}
				// #endif

				this.rentAndbuyMark = 1
				this.$refs.productDetails.show();
				this.isShow = true;
			},
			//返回首页
			back_index() {
				uni.switchTab({
					url: '/pages/index/index'
				});
			},
			//选择规格名称
			guigeNameChange(ind) {
				this.guigeNameCurrent = ind;
				this.upDataShowGuigeObj();
				this.guigeNameStr = this.guigeNameDataList[ind].specColor;
			},
			guigeChange(ind) {
				this.guigeCurrent = ind;
				this.upDataShowGuigeObj();
				this.guigeStr = this.guigeDataList[ind].specValue;
			},
			//选择先享天数
			daysChange(ind, state) {
				this.daysCurrent = ind;
				this.choiceDays = this.proDayList[ind].day;
				console.log('选择的天数', this.choiceDays);
				return
				if (state == 1) {
					this.daysCurrent = ind;
					this.choiceDays = this.proDayList[ind].day.day;
					console.log('选择的天数', this.choiceDays);
				} else {
					let canChoiceDay = ''
					this.showDayList.forEach((item, index) => {
						if (index == this.showDayList.length - 1) {
							canChoiceDay += (item + 1)
						} else {
							canChoiceDay += (item + 1) + '、'
						}
					})
					uni.showToast({
						title: `您的资质暂时支持先享后付的${canChoiceDay}天，准时履约会开放更多的信用天数`,
						icon: 'none',
						duration: 4000
					});
				}
			},
			//选择不同的规格定位到当前的数据对象，更新页面
			upDataShowGuigeObj() {
				this.data.productSku.some((item) => {
					if (this.guigeNameDataList[this.guigeNameCurrent].specColor == item.specColor && this
						.guigeDataList[this.guigeCurrent].specValue == item.specValue) {
						this.firstGuigeDataObj = item;
						return true;
					}
				});
			},
			//对象数组去重（用于商品规格去重）
			deweight(arr, type) {
				if (type == '1') {
					var obj = {};
					arr = arr.reduce(function(data, item) {
						obj[item.specColor] ? '' : (obj[item.specColor] = true && data.push(item));
						return data;
					}, []);
				} else {
					var obj = {};
					arr = arr.reduce(function(data, item) {
						obj[item.specValue] ? '' : (obj[item.specValue] = true && data.push(item));
						return data;
					}, []);
				}
				return arr;
			},

			//获取产品租赁方式
			getProductLeaseModeList() {
				this.$request(
					'product/mall/aliPay/product/getProductLeaseModeList', {
						productId: this.productId
					},
					'get',
					false
				).then((res) => {
					console.log('产品租赁方式', res);
					// this.productLeaseModeList = res.data;
					res.data.forEach(item => {
						// if (item.name.indexOf('买断') == -1) {
						this.productLeaseModeList.push(item)
						// }
					})
					if (this.productLeaseModeList.length != 0) {
						this.isBuyOut = this.productLeaseModeList[0].id;
					}
				});
			},
			productSku() {
				this.isShow = false;
				this.kefu = false;
			},

			//去下单
			mianyazu() {
				console.log('用户登录的总信息', getZWZUserDetail());
				// #ifdef H5 || APP-PLUS
				if (!this.$getUid()) {
					this.$goLogin();
					return;
				}
				// #endif

				// #ifndef H5 || APP-PLUS
				// let isPhone = checkHasPhone();
				// if (!isPhone) {
				// 	this.$refs.modalForm.toLogin();
				// 	return;
				// }
				// #endif

				// #ifdef APP-PLUS || H5
				let userdetailObj = getZWZUserDetail()
				console.log('嘎嘎嘎', userdetailObj.nickName.length);
				let isPhone = checkHasPhone();
				if (!isPhone && userdetailObj.nickName.length != 11) {
					this.$onTo('/pagesOther/appLoginphone/appLoginphone')
					return;
				}
				// #endif

				// #ifdef APP-PLUS || H5
				if (!this.isHasUserIdSta) {
					this.$refs.antsSignAppH5.toLogin();
					return;
				}
				// #endif




				//龙隆专属（下单前要先认证）
				if (!this.longlongHasCertification) {
					this.$onTo('/pagesMy/certificates/certificates?isFormPro=1')
					return;
				}
				this.popupLeaseorBuyorAddcar = 1;
				this.rentAndbuyMark = 1;
				this.$refs.productDetails.show();
				this.isShow = true;
			},

			/**
			 * 选择租赁模式（租完买端/租完即送）
			 */
			getChoseBuyoutOrSend(type) {
				console.log('选择租赁模式', type);
				this.isBuyOut = type;
			},

			//在选完规格和数量之后---点击确定提交订单---rentAndbuyMark == 1是租，跳转原来的，==2是买，跳转新的买的确认订单页
			onConfirm() {

				this.$setGlobalData('productIdForXieyi', this.productId); // 保存产品ID，confirm页面的相关接口并没有返回该相关信息
				console.log('99==', this.rentAndbuyMark);
				if (this.rentAndbuyMark == 1) {

					this.$onTo(
						`/pagesClass-rich/confirm-rich/confirm-rich?duration=${this.choiceDays}&skuId=${this.firstGuigeDataObj.id}&isBuyOutOrSend=${this.isBuyOut}&sales_p=${this.sales_p}&skuNum=${this.skuNum}&rentAndbuyMark=${this.rentAndbuyMark}&specValue=${this.goodsGuige}&productName=${this.data.name}&productImg=${this.firstGuigeDataObj.specSrc}&productId=${this.data.productId}&shopId=${this.data.shopId}`
					);
				}
			},
			addNum() {
				if (this.skuNum >= 1) {
					uni.showToast({
						title: '最多申请1件哦',
						icon: 'none'
					});
					return;
				}
				this.skuNum++;
			},
			cutNum() {
				if (this.skuNum === 1) {
					this.skuNum = 1;
					uni.showToast({
						title: '至少申请1件哦',
						icon: 'none'
					});
				} else {
					this.skuNum--;
				}
			},
			//获取商品banner图下标
			onBanner(e) {
				this.current = e.detail.current;
			},
			getPartMoney(isFront, price) {
				const _price = price || '';
				if (!_price) return EMPTY_PLACEHOLDER;
				const list = _price.toString().split('.');
				const result = isFront ? list[0] : list[1];
				return result || 0;
			},

			//收藏
			addProductCollection() {
				if (!this.$getUid()) {
					this.$goLogin();
				}
				this.$request(
					'member/mall/userCollection/addProductCollection', {
						resourceId: this.productId,
						resourceType: 'PRODUCT',
						uid: this.$getUid()
					},
					'post'
				).then((res) => {
					this.collected = true;
					uni.showToast({
						title: '收藏成功',
						icon: 'none'
					});
				});
			},
			//取消收藏
			cancelProductCollection() {
				if (!this.$getUid()) {
					this.$goLogin();
				}
				this.$request(
					'member/mall/userCollection/cancelProductCollection', {
						resourceId: this.productId,
						resourceType: 'PRODUCT',
						uid: this.$getUid()
					},
					'post'
				).then((res) => {
					if (res) {
						this.collected = false;
						uni.showToast({
							title: '取消收藏成功',
							icon: 'none'
						});
					}
				});
			},
			getProductList(HTML_A_TAG) {
				this.$request(
						'product/mall/aliPay/product/getProductDetailLite', {
							itemId: this.productId,
							uid: getUserId()
						},
						'get',
						false,
						true
					)
					.then((res) => {
						//如果商品下架跳商品详情页面
						this.rentAndbuy = res.rentOrPurchase;
						let testImgs = [
							'https://mochongzujie.oss-cn-hangzhou.aliyuncs.com/c6f9a53eeb414638bbf50b9f96a6c561.jpg',
							'https://mochongzujie.oss-cn-hangzhou.aliyuncs.com/4f3c045f52f64bb6bb5a21de50ef31c0.mp4'
						];
						if (res.images && res.images.length > 0) {
							let isHasVideo = res.images.some((item) => item.indexOf('.mp4') != '-1');
							res.images.forEach((items) => {
								if (items.indexOf('.mp4') == '-1') {
									this.imgList.push(items);
								} else {
									this.videosLIst.push(items);
								}
							});
							if (!!isHasVideo) {
								this.imgsvideoSta = true;
								this.isVideoSta = true;
								this.isImgsSta = false;
							} else {
								this.isVideoSta = false;
								this.isImgsSta = true;
							}
						}


						this.data = res;
						// this.choiceDays = this.data.noCardState == 0 ? 6 : 9
						this.firstGuigeDataObj = res.productSku[0];
						this.guigeNameDataList = this.deweight(res.productSku, '1'); //对象数组去重
						this.guigeDataList = this.deweight(res.productSku, '2');
						this.guigeNameStr = this.guigeNameDataList[this.guigeNameCurrent].specColor;
						this.guigeStr = this.guigeDataList[this.guigeCurrent].specValue;
						if (this.data.proDayList && this.data.proDayList.length > 0) {
							this.proDayList = this.data.proDayList;
							this.choiceDays = this.data.proDayList[0];
						}

						if (this.data.firstEnjoyedDay && Object.keys(this.data.firstEnjoyedDay).length != 0) {
							this.proDayList = []
							if (this.data.firstEnjoyedDay['proDayList'].length > 0) {
								this.proDayList = this.data.firstEnjoyedDay['proDayList']

								this.proDayList.forEach(item => {
									if (!item.day) {
										this.$set(item, 'day', item.totalPeriods * 30)
										this.$set(item, 'periods', item.totalPeriods)
									}
								})
							}
							this.proDayList = this.removeSamePrce(this.proDayList, 'periods')
							console.log('新改的---哈哈哈', this.proDayList);
							this.choiceDays = this.proDayList[0].day;
						}


						const initSkuObj = res.productSku[0] || {};
						this.sales_p = initSkuObj.marketPrice;
						this.currentSku = initSkuObj;
						this.check_obj.img = this.data.productSku[0].specSrc || ''; //设置首图
						this.collected = res.collected;
						res.detail = res.detail.replace(/<p><\/p>/g, '');
						res.detail = res.detail.replace(/<img src/g, '<img style="width: calc(100% - 0px);" src ');
						res.detail = res.detail.replace(/width=\"[0-9]{0,9}\" height=\"[0-9]{0,9}\"/g, '');
						res.detail = res.detail.replace(/<div class="media-wrap image-wrap">/g, '');
						res.detail = res.detail.replace(/<\/div>/g, '');
						parse(res.detail, (err, nodes) => {
							if (!err) {
								const transferNodes = nodes.map((i) => {
									const {
										children,
										name,
										attrs
									} = i;
									const obj = i;
									// 这里没有处理 children
									if (name === HTML_A_TAG) {
										// 这里假定 原本的htmlstring中 a标签为原本跳转的元素
										obj.marks = {
											...attrs,
											name: HTML_A_TAG
										}; // 小程序中不支持 a标签的href属性，先把对应的href 属性放在marks中
									}
									return obj;
								});
								this.nodes = transferNodes; // 更新到 rich-text 组件上
							}
						});
					})
					.catch((res) => {
						console.log('商品详情接口捕获错误');
						this.$onTo(`/pagesClass-rich/offShelves-rich/offShelves-rich?productId=${this.productId}`,
							false, true);
						if (res.errorCode === 'RPC000011') this.$onTo(
							`/pagesClass-rich/offShelves-rich/offShelves-rich?productId=${this.productId}`, false,
							true);
					})
					.finally((res) => {
						console.log('--商品详情接口finally--', res);
					});
			},
			removeSamePrce(arr, prop) {
				const map = new Map();
				return arr.filter(obj => !map.has(obj[prop]) && map.set(obj[prop], true));
			},
			gotoServerMan() {
				uni.setStorageSync(
					'product',
					JSON.stringify({
						goodsId: this.productId,
						image: this.imgList[0],
						name: this.data.name,
						price: this.data.productSku[0].salePrice
					})
				);
				uni.navigateTo({
					url: '/pages/chat/chat?shopId=' + this.data.shopId
				});
			},
			//龙隆下单前要先认证
			rengzhengBefore() {
				this.$request('member/mall/userCertification/hasCertification', {}, 'get', true, true)
					.then((res) => {
						const canxiadan = ['UN_UPLOAD', 'FINISH']; // 前者表示未上传照片，后者表示已认证
						this.longlongHasCertification = canxiadan.includes(res.data);
					})
					.finally(() => {

					});
			},
		}
	};
</script>
<style lang="scss" scoped>
	.image-wrap {
		width: 100% !important;
	}

	.image-wrap img {
		width: 100% !important;
	}

	page {
		padding-bottom: 150rpx;
	}

	.product_rich {
		.hide {
			display: none;
		}

		.header-banner_rich {
			align-items: center;
			text-align: center;
			display: flex;
			justify-content: center;
			position: relative;
			width: 750rpx;
			height: 750rpx;
			background-color: #ffffff;

			.imgsvideo_block {
				padding: 4rpx 0;
				background-color: #474747;
				opacity: 0.6;
				font-weight: 600;
				font-size: 24rpx;
				color: #ffffff;
				border-radius: 40rpx;
				position: absolute;
				top: 10rpx;
				left: 10rpx;
				z-index: 99;

				.imgstext_1 {
					border-radius: 40rpx;
					letter-spacing: 0.1em;
					display: inline-block;
					margin-right: 5rpx;
					padding: 8rpx 15rpx;

				}

				.imgstext_2 {
					border-radius: 40rpx;
					padding: 8rpx 15rpx;
					display: inline-block;
					margin-left: 5rpx;
					letter-spacing: 0.1em;
				}

				.isColor {
					color: #000;
					background-color: #ffffff;

				}
			}

			.swiper-img {
				width: 750rpx;
				height: 750rpx;

				.item {
					border: 1rpx solid transparent;
					-webkit-touch-callout: default;
					width: 750rpx;
					height: 750rpx;
				}

				image {
					-webkit-touch-callout: default;
				}
			}
		}

		.pilot_lamp_rich {
			background-color: #ffffff;
			padding-top: 10rpx;
			display: flex;
			justify-content: center;


			.circle_rich {
				margin: 0 5rpx 0 5rpx;
				width: 20rpx;
				height: 8rpx;
				border-radius: 10rpx;
			}

			.bolding {
				background-color: #f35111;
			}

			.bolding1 {
				background-color: #dfdfdf;
			}
		}

		.pro_name {
			padding: 30rpx;
			box-sizing: border-box;
			background-color: #ffffff;
			border-radius: 0rpx 0rpx 10rpx 10rpx;

			.title {
				font-weight: 600;
				word-break: break-all;
				color: #333333;
				line-height: 45rpx;
				font-size: 32rpx;
				font-family: PingFangSC-Light, PingFang SC;
				position: relative;
				overflow: hidden;

				.title-text {
					position: relative;
					top: 4rpx;
				}
			}

			.price-area {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: flex-end;

				.left {
					color: #e52021;

					.m {
						font-size: 24rpx;
						margin-right: 6rpx;
					}

					.l {
						font-size: 48rpx;
						font-weight: 500;
					}

					.d {
						font-size: 24rpx;
					}

					.r {
						font-size: 22rpx;
						font-weight: 500;
					}
				}

				.right {
					margin-left: 10rpx;
					margin-bottom: 3rpx;
					font-weight: 400;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					color: #999999;
				}
			}
		}

		.three_container {
			padding: 15rpx 0;
			box-sizing: border-box;

			.three_box {
				width: 720rpx;
				background-color: #ffe3d7;
				margin: 0 auto;
				border-radius: 20rpx;
				padding: 50rpx 50rpx 20rpx 50rpx;
				box-sizing: border-box;

				&_item {
					display: flex;
					align-items: center;
					margin-bottom: 40rpx;
					justify-content: space-between;

					.tit {
						flex-shrink: 0;
						letter-spacing: 0.05em;
						color: #8b8b8b;
						font-weight: 600;
					}

					.tit1 {
						font-size: 24rpx;
						font-weight: 600;
						letter-spacing: 0.05em;

					}
				}
			}
		}

		.usenotice_container {
			padding: 15rpx 0;
			box-sizing: border-box;

			.usenotice_box {
				padding: 50rpx 40rpx 20rpx 40rpx;
				margin: 0 auto;
				border-radius: 20rpx;
				box-sizing: border-box;
				width: 720rpx;
				background-color: #ffe3d7;

				&_item {
					display: flex;
					margin-bottom: 25rpx;
					flex-direction: column;

					.big_tit {
						color: #f35111;
						letter-spacing: 0.05em;
						font-weight: 600;

					}

					.title {
						margin-left: 10rpx;
						line-height: 40rpx;
						letter-spacing: 0.03em;
						font-size: 24rpx;
						margin-bottom: 10rpx;
					}

					.last_word {
						color: #f35111;
						font-weight: 600;
						margin-left: 10rpx;
						letter-spacing: 0.05em;
					}
				}
			}
		}

		.details_rich {
			margin: 20rpx 0;
			border-radius: 10rpx;
			background-color: #ffffff;

			.tabs {
				display: flex;
				align-items: center;
				justify-content: center;

				.item {
					font-size: 30rpx;
					font-weight: 500;
					color: #333333;

					.select {
						width: 60rpx;
						height: 6rpx;
						@include global-background-color-red();
						margin: 0 auto;
						border-radius: 3rpx;
						margin-top: 10rpx;
					}
				}
			}

			.parameter_rich {

				color: #14151a;
				margin-top: 40rpx;
				font-size: 38rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;

				.parameterItem_rich {
					margin-top: 30rpx;
					margin-bottom: 80rpx;
				}
			}
		}


		.footer_rich {
			display: flex;
			justify-content: space-around;
			align-items: center;
			background-color: #fff;
			position: fixed;
			bottom: 0;
			width: 100%;
			height: 98rpx;
			box-shadow: 0px -2px 6px 0px rgba(0, 0, 0, 0.12);
			z-index: 1999;


			.home_rich {
				text-align: center;

				.home-img {
					width: 36rpx;
					height: 36rpx;
				}

				.home-img1 {
					width: 39rpx;
					height: 35rpx;
				}

				.text {
					color: #1f2129;
					line-height: 12rpx;
					font-size: 18rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
				}
			}

			.bot {
				line-height: 80rpx;
				font-size: 30rpx;
				color: #ffffff;
				width: 220rpx;
				height: 80rpx;
				background: #e57460;
				text-align: center;
				font-weight: 500;
			}

			.bot_my_rich {
				height: 80rpx;
				@include global-background-color-red();
				font-size: 32rpx;
				font-weight: 600;
				line-height: 80rpx;
				letter-spacing: 0.1em;
				width: 400rpx;
				border-radius: 80rpx;
				text-align: center;
				letter-spacing: 0.2em;

			}
		}

		.productDetails_rich {
			margin-bottom: 160rpx;
			padding-bottom: 30rpx;

			.shop {
				margin-top: 30rpx;
				align-items: center;
				padding: 0 30rpx;
				display: flex;

				.img {
					margin-right: 20rpx;
					width: 165rpx;
					height: 165rpx;

				}

				.content {
					display: flex;
					justify-content: center;

					.fut {
						margin-top: 10rpx;
						margin-right: 10rpx;
						border-radius: 20px;
						color: #333333;
						padding: 1px 5px;
						@include global-background-color-red();
						color: #fff;
						font-size: 22rpx;
						font-weight: 500;
						padding: 2px 10px;
					}
				}
			}

			.choice {
				padding: 0 30rpx;

				.title {
					font-size: 28rpx;
					margin-bottom: 20rpx;
					font-weight: 500;
					color: #333333;
				}

				.scroll_guige {
					width: 95%;
					white-space: normal;
					overflow: hidden;

				}

				.title-item {
					display: inline-block;
					border-radius: 20px;
					margin-bottom: 10px;
					padding: 6rpx 40rpx;
					background: #f2f2f2;
					font-size: 24rpx;
					font-weight: 400;
					color: #333333;
					margin-right: 20rpx;
				}
			}

			.an {
				position: fixed;
				bottom: 50rpx;
				border: beige;
				text-align: center;
				font-size: 28rpx;
				font-weight: 500;
				height: 97rpx;
				@include global-background-color-red();
				color: #ffffff;
				border-radius: 40rpx;
				line-height: 80rpx;
				width: 690rpx;
				height: 80rpx;

				&::after {
					content: none;
				}
			}

			.content {
				.price-area {
					.left {
						color: #333333;

						.m {
							font-size: 24rpx;
							margin-right: 6rpx;
						}

						.l {
							font-size: 48rpx;
							font-weight: 500;
						}

						.d {
							font-size: 24rpx;
						}

						.r {
							font-size: 22rpx;
							font-weight: 500;
						}
					}

					.fut-opacity {
						opacity: 0;
					}

					.right {
						font-size: 22rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #999999;
						margin-left: 10rpx;
					}
				}
			}
		}
	}

	.num_btn {
		height: 61rpx;
		line-height: 61rpx;
		float: left;
		width: 80rpx;

	}

	.input {
		height: 60rpx;
		border: 1rpx solid #f56709;
		border-radius: 10rpx;
		padding: 0 25rpx;
		margin: 0 10rpx;
		width: 80rpx;
		font-size: 26rpx;
		float: left;
		text-align: center;
	}
</style>